<template slot-scope="props">
	<section>
		<el-form :inline="true" :model="formInline" class="demo-form-inline" size="medium">
			<el-form-item label="科室名称">
				<el-autocomplete class="inline-input" v-model="formInline.dmmc" @input="queryAll()" :fetch-suggestions="querySearch"
				 placeholder="请输入内容" @select="handleSelect"></el-autocomplete>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="queryAll()">新增</el-button>
			</el-form-item>

			<el-table :data="tableData" border fit height="400px">
				<el-table-column prop="kbxh" label="序号" min-width="70%">
					<template slot-scope="scope">
						<el-input v-model="scope.row.kbxh" placeholder="请输入"></el-input>
					</template>
				</el-table-column>
				<el-table-column prop="dm" label="代码" min-width="100%">
					<template slot-scope="scope">
						<el-input v-model="scope.row.dm" placeholder="请输入"></el-input>
					</template>
				</el-table-column>
				<el-table-column prop="kbjc" label="简称" min-width="140%">
					<template slot-scope="scope">
						<el-input v-model="scope.row.kbjc" placeholder="请输入"></el-input>
					</template>
				</el-table-column>
				<el-table-column prop="dmmc" label="科室名称" min-width="100%">
					<template slot-scope="scope">
						<el-input v-model="scope.row.dmmc" placeholder="请输入"></el-input>
					</template>
				</el-table-column>
				<el-table-column prop="kmdm" label="科目代码" min-width="90%">
					<template slot-scope="scope">
						<el-input v-model.trim="scope.row.kmdm" placeholder="请输入" @keyup.32.native="OpenDialog(scope.$index,scope.row.date,2)"></el-input>
					</template>
				</el-table-column>
				<el-table-column prop="kmmc" label="科目名称" min-width="140%">
					<template slot-scope="scope">
						<el-input v-model="scope.row.kmmc" placeholder="请输入"></el-input>
					</template>
				</el-table-column>
				<el-table-column prop="jzbz" label="急诊">
					<template slot-scope="scope">
						<el-input v-model="scope.row.jzbz" placeholder="请输入"></el-input>
					</template>
				</el-table-column>
				<el-table-column prop="jtbz" label="家庭病床">
					<template slot-scope="scope">
						<el-input v-model="scope.row.jtbz" placeholder="请输入"></el-input>
					</template>
				</el-table-column>
				<el-table-column prop="bz" label="是否停用" min-width="130%">
					<template slot-scope="scope">
						<el-switch v-model="scope.row.bz" active-value="1" inactive-value="0" active-text="启" inactive-text="停"
						 active-color="#13ce66" inactive-color="#ff4949">
						</el-switch>
					</template>
				</el-table-column>
				<el-table-column prop="zkbz" label="专科级别" :formatter="zkbzFormat" min-width="155%">
					<template slot-scope="scope">
						<el-select v-model="scope.row.zkbz" placeholder="请选择">
							<el-option v-for="item in zkbzOptions" :key="item.zkbzvalue" :label="item.zkbzlabel" :value="item.zkbzvalue">
							</el-option>
						</el-select>
					</template>
				</el-table-column>

				<el-table-column prop="tjgk" label="统计归口">
					<template slot-scope="scope">
						<el-input v-model.trim="scope.row.tjgk" placeholder="请输入" @keyup.32.native="OpenDialog(scope.$index,scope.row.date,3)"></el-input>
					</template>
				</el-table-column>
				<el-table-column label="操作" width="180" fixed="right">
					<template slot-scope="scope">
						<el-button size="mini" type="primary" @click="update(scope.row)">修改</el-button>
						<el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
					</template>
				</el-table-column>
			</el-table>
		</el-form>
		<!-- <paging-toolbar :pager="pager" @change="queryAll('condition')" /> -->
		
		<template>
			<medical-subjects :show1.sync="show1" ref="dialogtree" :msg.sync="indexs" /></template>
		<template>
			<get-department-statistics :show2.sync="show2" ref="dialogtree" :msg.sync="indexs" /></template>
	</section>
</template>

<script>
	import {
		GetOutpatientDepartment,
		UpdateOutpatientDepartment
	} from "@/api";
	import PagingToolbar from '../../components/toolbar/paging';
	import InpatientArea from '../../components/dialog/inpatientArea';
	import MedicalSubjects from '../../components/dialog/medicalSubjects';
	import GetDepartmentStatistics from '../../components/dialog/getDepartmentStatistics';
	export default {
		components: {
			PagingToolbar,
			InpatientArea,
			MedicalSubjects,
			GetDepartmentStatistics
		},
		data() {
			return {
				show: false,
				show1: false,
				show2: false,
				indexs: 0,
				pager: {
					total: 0, // 总条数
					page: 1, // 当前页
					rows: 10 // 每页显示多少条
				},
				restaurants: [],
				formInline: {},
				tableData: [],
				zkbzOptions: [
					{
						zkbzvalue: '0',
						zkbzlabel: '---请选择---'
					},
					{
						zkbzvalue: '1',
						zkbzlabel: '国家级专科'
					}, {
						zkbzvalue: '2',
						zkbzlabel: '省(市区)级专科'
					},
					{
						zkbzvalue: '3',
						zkbzlabel: '地(市)级专科'
					},
					{
						zkbzvalue: '4',
						zkbzlabel: '院级专科'
					}
				],
				zkbzvalue: ''

			}
		},
		methods: {
			querySearch(queryString, cb) {
				var restaurants = this.restaurants;
				var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
				// 调用 callback 返回建议列表的数据
				cb(results);
			},
			createFilter(queryString) {
				return (restaurant) => {
					return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
				};
			},
			queryAll() {
				GetOutpatientDepartment(this.formInline).then(res => {
					this.tableData = res.data.data
				})
			},
			fatherMethod(res, index, int) {
				if (int === 1) { //科目
					this.tableData[index].kmdm = res.dm
					this.tableData[index].kmmc = res.dmmc
					this.show1 = false;
				} else if (int === 2) { //统计归口
					this.tableData[index].tjgk = res.dm
					this.show2 = false;
				} else {
					this.tableData[index].bqdm = res.dm
					this.tableData[index].bqmc = res.dmmc
					this.show = false;
				}
			},
			zkbzFormat(row, column) {
				if (row.zkbz === "1") {
					return '国家级专科'
				} else if (row.zkbz === "2") {
					return '省(市区)级专科'
				} else if (row.zkbz === "3") {
					return '地(市)级专科'
				} else if (row.zkbz === "4") {
					return '院级专科'
				}
			},
			loadAll() {
				return [];
			},
			handleSelect(item) {},
			OpenDialog(index, res, int) {
				if (int === 1) {
					this.indexs = index
					this.show = true;
				} else if (int === 2) {
					this.indexs = index
					this.show1 = true;
				} else if (int === 3) {
					this.indexs = index
					this.show2 = true;
				}

			},
			update(row) {
				this.$confirm('确定要修改此项吗, 是否继续?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					UpdateOutpatientDepartment(row).then(res => {
						if (res.data.code === 0) {
							this.$message({
								type: 'success',
								message: '修改成功!'
							});
						} else {
							this.$message({
								type: 'error',
								message: '修改失败请联系管理员!'
							});
						}
						this.queryAll();
					})

				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消修改'
					});
					this.queryAll();
				});

			}

		},
		mounted() {
			this.restaurants = this.loadAll();
			this.queryAll();
		}
	};
</script>

<style>
</style>
